import {createRouter,createWebHashHistory} from 'vue-router'
import Subscribe from "@/components/Menu/Subscribe";
const SingerDetail=()=>import("@/components/List/Search/SingerDetail")
const Empty=()=>import("@/components/Layout/Empty");
const Empty2=()=>import("@/components/Layout/Empty2");
const Login=()=>import( "@/components/Login/UserLogin");
const Video =()=>import("@/components/Menu/Video");
const Music_Hall=()=>import( "@/components/Menu/Music_Hall");
const AlbumDetail=()=>import( "@/components/List/AlbumDetail");
const SearchList=()=>import("@/components/List/Search/SearchList");
const Recommendation=()=>import("@/components/Menu/Recommendation");
const PlayPage=()=>import("@/components/Page/PlayPage");
const SongsMV=()=>import("@/components/List/SongsMV");
const SongsList=()=>import( "@/components/List/SongsList");
const About=()=>import("@/components/views/About");
const Aside=()=>import("@/components/Layout/Aside");
const Audio=()=>import("@/components/Layout/Audio");
const Header=()=>import("@/components/Layout/Header");
const Play=()=> import("@/components/views/Play");
const Content=()=>import("@/components/Layout/Content");
const Footer=()=> import("@/components/Layout/Footer");
const HomePage=()=>import("@/components/Page/HomePage");
const PlayListTable=()=>import("@/components/List/PlayListTable")
const SongComment=()=>import("@/components/List/Comment/SongComment")
// 2. 定义一些路由
// 每个路由都需要映射到一个组件。
// 我们后面再讨论嵌套路由。
const routes = [
    { path: '/', redirect:'/homePage'},
    { path: '/login', component:Login},
    { path: '/about', component: About },
    { path: '/aside', component: Aside },
    { path: '/audio', component:Audio},
    { path: '/header', component: Header },
    { path: '/footer', component: Footer },
    { path: '/homePage', component:HomePage},
    {path: '/playListTable', component:PlayListTable},
    { path: '/content', alias:'/main',component:Content},
    { path: '/homePage', component:HomePage,
        children:[
            { path: '/homePage/play',component: Play },
            { path: '/homePage/songsList', component: SongsList,
                children:[
                    {path: '/homePage/songsList/1', component:()=>import("@/components/List/PlayListTable")},
                    {path: '/homePage/songsList/3', component:()=>import("@/components/List/Comment/PlayListComment")}
                ]},
            { path: '/homePage/AlbumDetail', component: AlbumDetail,
                children:[
                    {path: '/homePage/AlbumDetail/1', component:()=>import("@/components/List/PlayListTable")},
                    {path: '/homePage/AlbumDetail/2', component:()=>import("@/components/List/Comment/AlbumComment")}
                ]
            },
            { path: '/homePage/searchList', component:SearchList,
                 children:[
                     {path:'/homePage/searchList/1',component:()=>import("@/components/List/Search/SongsTable")},
                     {path:'/homePage/searchList/2',component:()=>import("@/components/List/Search/MVList")},
                     {path:'/homePage/searchList/3',component:()=>import("@/components/List/Search/AlbumList")},
                     {path:'/homePage/searchList/4',component:()=>import("@/components/List/Search/Allsingers")},
                     {path:'/homePage/searchList/5',component:()=>import("@/components/List/Search/Featured")},
                 ]
            },
            { path: '/homePage/playPage',component:PlayPage},
            { path: '/homePage/songsMV/:mvurl', name:'songsMV', component:SongsMV},
            { path: '/homePage/recommendation', component:Recommendation},
            { path: '/homePage/music_Hall',component:Music_Hall,meta: {
                    keepAlive: true,
                },
                children: [
                    {path:'/homePage/music_Hall/1',component:()=>import("@/components/Menu/MusichallType/Highquality")},
                    {path:'/homePage/music_Hall/2',component:()=>import("@/components/Menu/MusichallType/Ranks")},
                    {path:'/homePage/music_Hall/3',component:()=>import("@/components/Menu/MusichallType/ArtistList")},
                    {path:'/homePage/music_Hall/4',component:()=>import("@/components/Menu/MusichallType/TypePlayList")}
                ]
            },
            { path: '/homePage/video',component:Video,
            children: [
                {path:'/homePage/video/1',component:()=>import("@/components/Menu/VideoType/RecommendationVideo")},
                {path:'/homePage/video/2',component:()=>import("@/components/Menu/VideoType/VideoList")},
                {path:'/homePage/video/3',component:()=>import("@/components/Menu/VideoType/VideoRank")},
            ]
            },
            { path: '/homePage/singerDetail',component:SingerDetail,
             children:[
              {path:'/homePage/singerDetail/2',component:()=>import("@/components/List/Search/MVList")},
              {path:'/homePage/singerDetail/3',component:()=>import("@/components/List/Search/AlbumList")},
              {path:'/homePage/singerDetail/4',component:()=>import("@/components/List/Search/Detail")},
              {path:'/homePage/singerDetail/5',component:()=>import("@/components/List/Search/Featured")},
             ]},
            { path: '/homePage/empty/:mvurl',name:"empty", component:Empty},
            { path: '/homePage/empty2',name:"empty2", component:Empty2},
            { path: '/subscribe', component:Subscribe},
            { path: '/homePage/songComment',component:SongComment},
        ]
    },
]

// 3. 创建路由实例并传递 `routes` 配置
// 你可以在这里输入更多的配置，但我们在这里
// 暂时保持简单
const router =createRouter({
    // 4. 内部提供了 history 模式的实现。为了简单起见，我们在这里使用 hash 模式。
    history: createWebHashHistory(),
    routes, // `routes: routes` 的缩写
})

// router.beforeEach((to,from,next)=>{
//     console.log(to.path);
//      console.log(from);
//      if(to.path==='/login')
//          console.log('yes');
//      next();
// })
export default router;